
<script setup>
import matterList from './components/matterList.vue'
import { taskManageMylistApi } from '@/apis/index.js'
import { ref } from 'vue'
import { onReachBottom } from '@dcloudio/uni-app'

const params = ref({
	pageSize: 10,
	pageNum: 1
})
const loadStatus = ref({
	status: "loadmore", // loadmore, loading, nomore
	noMore: false,
	loading: false
})
const backlogList = ref([])
const getAlertList = async () => {
	// 防止重复加载
	if (loadStatus.value.noMore || loadStatus.value.loading) return
	loadStatus.value.loading = true
	loadStatus.value.status = "loading"
	try {
		const res = await taskManageMylistApi(params.value)
		const { rows, total } = res
		// 如果是第一页，重置数据
		if (params.value.pageNum === 1) {
			backlogList.value = rows
		} else {
			backlogList.value = [...backlogList.value, ...rows]
		}
		// 判断是否还有更多数据
		if (rows.length < params.value.pageSize || backlogList.value.length >= total) {
			loadStatus.value.noMore = true
			loadStatus.value.status = "nomore"
		} else {
			loadStatus.value.status = "loadmore"
		}
		// 只有成功获取数据后才增加页码
		params.value.pageNum++
	} catch {
		// 失败时恢复状态
		loadStatus.value.status = "loadmore"
	} finally {
		loadStatus.value.loading = false
	}
}
getAlertList()
onReachBottom(() => {
	if (!loadStatus.value.noMore) {
		getAlertList()
	}
})

</script>

<template>
	<view class="page_container pt">
		<matterList :list="backlogList" :loadmoreStatus="loadStatus.status" />
	</view>
</template>

<style lang="scss" scoped></style>